<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8"/>
  <meta name="generator" content="tiny-template"/>
  <title>wet template</title>
  <style type="text/css">
  .pkg-version {
      background-color: #5f6371;
      color: #ffffff;
      padding: 2px 5px;
      margin: 0 5px;
  }

  table {
      border-collapse: collapse;
  }

  th, td {
      border: 1px solid #5f6371;
  }
  </style>
</head>
<body>
<h1>
  <span>{{author + '/' + name}}</span>
  <small class="pkg-version">{{version}}</small>
</h1>
<p>
  不解析表达式符号 {!{ 和 }!}
</p>
<t-if on="description">
  <p>{{description}}</p>
</t-if>
<t-else>
  <p>无描述</p>
</t-else>
<ul>
  <t-for on="script, name in scripts">
    <li>{{name}}: {{script}}</li>
  </t-for>
</ul>
<t-if on="false">
  <!-- 不显示 -->
</t-if>
<t-elif on="true">
  <span>t-elif</span>
</t-elif>

<t-if on="false">
  <!-- 不显示 -->
</t-if>
<t-else>
  <span>t-else</span>
</t-else>
<h3>keywords</h3>
<table>
  <thead>
  <th>index</th>
  <th>keyword</th>
  </thead>
  <t-for on="keyword, i of keywords">
    <tr>
      <td>{{i}}</td>
      <td>{{keyword}}</td>
    </tr>
  </t-for>
</table>
<h3>0-8</h3>
<em>不渲染 3</em>
<table>
  <thead>
  <th>index</th>
  <th>value</th>
  </thead>
  <t-for on="item, index of 8" continue="item === 3">
    <tr>
      <td>{{index}}</td>
      <td>{{item}}</td>
    </tr>
  </t-for>
</table>
<h3>3-8</h3>
<em>在 7 停止</em>
<table>
  <thead>
  <th>index</th>
  <th>value</th>
  </thead>
  <t-for on="item, index of 3-8" break="item > 7">
    <tr>
      <td>{{index}}</td>
      <td>{{item}}</td>
    </tr>
  </t-for>
</table>
<hr>
<h3>t-include/t-hole/t-fill 示例</h3>
<t-include file="extra.html">
  <t-fill>fill the <b>default</b> hole</t-fill>
  <t-fill name="footer">
    <p>fill the <b>footer</b> hole</p>
  </t-fill>
</t-include>
<hr>
<div style="text-align: center">
  <span>Powered by {{name}}.</span>
</div>
</body>
</html>
